import React from 'react';
import { Popover } from 'antd';
interface TextEllipsisProps {
  maxLength?: number,
  value?: any
}
 const TextEllipsis = ({ value, maxLength = 30 }: TextEllipsisProps) => {
  let str = String(value);
  let ellipsisText = ''
  if (value&&str.length > maxLength) {
    ellipsisText = str.substring(0, maxLength);
    return <span>
      {ellipsisText}...
      <Popover title='查看更多'
        content={<div style={{ maxWidth: 600, overflow: 'auto', maxHeight: 600, wordWrap: 'break-word' }}>{value}</div>}>
        <a>
          查看更多
        </a>
      </Popover>
    </span>
  }
  return (<span>{value}</span>)
}
export default TextEllipsis